@charset "utf8";
header{
	/* 页面宽度固定 */
	width: 100%;
	height: 43px;
	/* 切片:大范围 */
	background: #333;
}
/* 切片：小范围 */
/* 中控区：决定内容显示 */
header div#wrapper{
	width: 1200px;
	height: 43px;
	backgr ound: #eaadea;
	margin-left: 220px;
}
/* 页头左侧 */
header div#wrapper div.head_left{
	width: 700px;
	height: 43px;
	backgro und: #7f7f7f;
	float: left;
}
/* 页头右侧 */
header div#wrapper div.head_right{
	width: 210px;
	height: 43px;
	back ground: #7d6fad;
	margin-left: 750px;
	margin-top: -43px;
}
header div#wrapper div.head_left ul.list li{
	float: left;
	height: 43px;
	font-size: 14px;
}
header div#wrapper div.head_left ul.list li a{
	/* 超链接 ：垂直居中，右侧竖线 间距*/
	line-height: 43px;
	/* 间隙：撑开-文字和竖线有间距 */
	padding: 0 9px;
	border-right: 1px solid #424242;
	
}
header div#wrapper div.head_left ul.list li a.c{
	border: 0;
}

/* ------------------------------------------------------------- */
/*页头右侧*/
header div#wrapper div.head_right{
	width: 210px;
	height: 43px;
	backg round: #7d6fad;
	float: right;
}
/* 右侧位：内容右浮动 */
header div#wrapper div.head_right ul li{
	float: right;
	font-size: 12px;
	height: 43px;
	
}
header div#wrapper div.head_right ul div.text_con{
	width: 210px;
	height: 20px;
	background-color: #c1dfea;
	position: absolute;
	top: 50px;
	display: none;
}
header div#wrapper div.head_right ul li a.b{ 
	border: 0;
}
header div#wrapper div.head_right ul li a.d{
		border: 0;
		position: relative;
		left: 3px;
	}
header div#wrapper div.head_right ul li.s{
	height: 43px;
	width: 109px;
	background: #424242;
}
/* 加精灵图 */
header div#wrapper div.head_right ul li.s i.shop{
	/* 撕开口：行内元素 左右 */
	padding: 0 10px;
	/* 图片没有导入 相对路径 */
	background: url(../img/buy.png) no-repeat;
	position: relative;
	left: 6px;
	top: 1px;
}	
/* 继续完成剩余效果 */
/* 难题：右侧区域没有加高，行高，间隙
        实现左侧类似效果
 */
/* 光标移动上去右侧购物车区域【背景色，先变色，然后在文本变色，同时给精灵图改变】 */
header div#wrapper div.head_right ul li.s:hover{
	background: #fff;
	
}
header div#wrapper div.head_right ul li.s:hover a{
color: #ff6700;
}
header div#wrapper div.head_right ul li.s:hover i{
	background: url(../img/buy01.png) no-repeat;
}	

